<!--  常用选择器  简单选择器
 -->
 <!DOCTYPE html>
 <html lang="en">
 <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
    /* 将所有的段落设置为红色  */
    /*1. 元素选择器 根据标签选择指定的全部元素 无法把特定的p变化  */
    /* 可以给p元素加一个id */
    /* 可以通过id属性值选择特定的元素 因为id是不能重复的   */
    /* 这里叫id选择器  根据id值去选择  */
    /* id同时只能给一个元素 还是不是很理想  而且还可能有兼容的问题 */
    /* 如果设置了重复的id 那可不行  */
    /* 将 两个颜色都改变 */
    /* 加上一个class标签 和id类似  */
    /* 不同的是class可以重复使用  */
    /* 类型选择器 根据元素的class来选择 一组元素  */
    /* 有blue类的元素就会变成蓝色  */
    /* 通配选择器 选中页面中的所有元素 */

    /* #dig{
        color:black
        }
    p{
        color:red
        
    } */
    /* 一般是class更加强大  */
    /* class用的更多 
    可以一个元素指定多个class
     */
    .blue{
        color:blue
    }
    .abc{
        font-size :10px;
    }
    </style>
    <!-- class可以写很多，多个class之间使用空格隔开  -->
 </head>
 <body>
    <p class="blue">111111111</p>
    <p class="blue">222222222</p>
    <p class="abc">3333333333</p>
    <p class="abc">444444444</p>
    <p id = dig>5555555555</p>
    <p>6666666666</p>
    
 </body>
 </html>